﻿@using HouseHoldBudget.App_GlobalResources
@using HouseHoldBudget.Models.Budgets
@using Kendo.Mvc.UI
@{
    ViewBag.Title = @CustomResources.ManageMyBudgets_Title;
    Layout = "~/Views/Shared/_Layout.cshtml";
}
<div class="section-header">
    <div class="title">
        <img src="@Url.Content("~/Content/images/budget.png")" alt="" />
        @CustomResources.ManageMyBudgets_Title
    </div>
</div>
<table class="content">
    <tr>
        <td>
            @(Html.Kendo().Grid<BudgetModel>()
                .Name("budgets-grid")
                .Columns(columns =>
                            {
                                columns.Bound(x => x.Id)
                                    .HtmlAttributes(new { style = "text-align:left;" })
                                    .Template(x => Html.ActionLink(@CustomResources.Common_Edit, "EditBudget", "Budget", new { budgetId = x.Id }))
                                    .ClientTemplate("<a class='t-icon t-edit' href=\"EditBudget?budgetId=#: Id #\"> #: BudgetName #</a>")
                                    .Title(@CustomResources.ManageMyBudgets_NameColumn).Filterable(false);
                                columns.Bound(x => x.BudgetDescription)
                                    .Title(@CustomResources.Common_Description);   
                            })
                        .ToolBar(toolbar => toolbar.Custom().Text(@CustomResources.ManageMyBudgets_AddBudget).Action("CreateBudget", "Budget"))            
                .DataSource(dataBinding => dataBinding.Ajax()
                                            .Model(model => model.Id(p => p.Id))
                                            .Read(read => read.Action("SelectMyBudgets", "Budget"))
                                            .PageSize(20))

                .Scrollable()
                .Sortable()
                .Filterable())              
        </td>
    </tr>
</table>
